<template>
  <div class="container">
    <div class="topbar">
        <div class="topbar-left"></div>
        <div class="topbar-text">个人中心</div>
        <div class="topbar-right"></div>
    </div>
    <van-tabbar v-model="active">
      <van-tabbar-item  class="iconfont icon-home2" to="/index">首页</van-tabbar-item>
      <van-tabbar-item  class="iconfont icon-tuijianliebiao"  to="/Recommend">推荐</van-tabbar-item>
      <van-tabbar-item  class="iconfont icon-fenlei" to="/Classify">分类</van-tabbar-item>
      <van-tabbar-item  class="iconfont icon-liaotian" to="/Chat">聊天</van-tabbar-item>
      <van-tabbar-item  class="iconfont icon-leimupinleifenleileibie" to="/My">个人中心</van-tabbar-item>
    </van-tabbar>
  </div>
</template>
<script>
export default {
    name: 'my',
    components: { 
    },
    computed: { 
    },
    data() {
        return {
			active:4,
        }
    },
    mounted() {
    },
    methods: {
    }
}
</script>


<style lang="scss" scoped>
  .container{
    .topbar{
      width:100vw;
      height:7vh;
      line-height:7vh;
      font-size:0.9rem;
      // background:rgba(255,255,255,1);
      background:#f90;
      color:#333;
      position:fixed;
      left:0;
      top:0;
      z-index:100;
      display:flex;
      .topbar-left{
          flex:1;
          text-align:center;
      }
      .topbar-text{
          flex:4;
          text-align:center;
      }
      .topbar-right{
          flex:1;
          text-align:center;
      }
    }
    .iconfont{
      font-size:0.7rem;
    }
    .iconfont:before{
      font-size:1rem;
    }
  }
            
</style>
